<template>
	<om-page>
		<ot-sl-filter @loadMore="loadMore" :showConfirm="false" :clearTree="true" :ref="'slFilter'" :topFixed="true" :menuList="filterList" @result="onChangeFilter" />
		<uni-list v-if="showTitle.length">
			<uni-list-item  @click="openPopup()" style="">
				 <view slot="header" >
					 <view class="tui-flex align-center" v-for="(item,index) in showTitle" :key="index" >
						<view class=" tui-right show-label" style="width:250rpx;font-size: 16px;">{{deleteHtml(item.title)}}</view>
						<p>{{'\xa0'}}</p>
						<view class="om-font-size" style="width:350rpx">{{userData[item.field]}}</view>
					 </view>
				 </view>
			</uni-list-item>
		</uni-list> 
		<view v-if="!showTitle.length" class="" style="margin-top:200px; display:flex;justify-content: center;align-items: center;">
			{{tips}}
		</view>
		<uni-popup  id="popup" ref="popup" :type="'center'">
			<view class="popup-cotent padding">
				<view class="margin popup-tip">
					请选择查询项目
				</view>
				<view v-for="(tableItem,tableIndex) in tableList" :key="tableIndex" class="popup-item padding" @click="toShowTable(tableItem.tableMark,tableItem.title)">
					<text>{{tableItem.title}}</text>
					<uni-icons :size="20" class="uni-icon-wrapper" color="#bbb" type="arrowright" />
				</view>
				<view class="margin flex justify-end" @click="cancel">
					<a class="cancel-btn">取消</a>
				</view>
			</view>
		</uni-popup>
	</om-page>
</template>

<script>
	import {
		mapState
	} from 'pinia';
	import {
		useLoginUserStore
	} from '@/stores/login-user.js';
	import { ignoreHtml } from '@/static/js/common.js';
	export default{
		provide() {
			return {
				searchKey: this
			}
		},
		data(){
			return{
				userData:{},
				formTitle:[],
				showTitle:[],
				tips:'',
				param:{
					page: 1,
					rows: 20,
					isoffice: true,
					instIds:''
				},
				tableList:[
					{
						title:'人员基本信息',
						tableMark: 'temployee-info',
					},
					{
						title:'任职岗位',
						tableMark: 'KEY_89',
					},
					{
						title:'调岗记录',
						tableMark: 'KEY_107',
					},
					{
						title:'教育经历',
						tableMark: 'KEY_90',
					},
					{
						title:'工作经历',
						tableMark: 'KEY_92',
					},
					{
						title:'家庭成员',
						tableMark: 'KEY_93',
					},
					{
						title:'奖罚记录',
						tableMark: 'KEY_181',
					},
					{
						title:'培训记录',
						tableMark: 'KEY_358',
					},
					{
						title:'绩效评价',
						tableMark: 'KEY_359',
					},
					{
						title:'个人信息变更记录',
						tableMark: 'KEY_94',
					}
					
				],
				url:'temployee/getDataGrid',
				filterList: [{
					title: '单位',
					defaultTitle: '单位',
					detailTitle: '请选择单位',
					key: 'orgin',
					isSort: true,
					reflexTitle: true,
					defaultSelectedIndex: 0,
					detailList: [{
						'title': '单位',
						'value': ''
					}]
				},{
					title: '部门',
					defaultTitle: '部门',
					detailTitle: '请选择部门',
					key: 'instIds',
					isTree: true,
					reflexTitle: true,
					defaultSelectedText: '',
					defaultSelectedValue: '',
					detailList: [{
						'title': '部门',
						'value': ''
					}]
					
				},{
					title: '姓名',
					defaultTitle: '姓名',
					detailTitle: '请选择姓名',
					key: 'name',
					isSort: true,
					reflexTitle: true,
					defaultSelectedIndex: 0,
					detailList: [{
						'title': '姓名',
						'value': ''
					}]
				}],
				selectUserId:'',
				selectUserName:''
			}
		},
		computed:{
			...mapState(useLoginUserStore, ['userId','userName','orgShortName','orgId','salaryInstName','salaryInstId','salaryPosId','salaryPosName']),
			deleteHtml(){
				return function(val){
					return ignoreHtml(val)
				}
			}
		},
		methods:{
			setCache(title,data){
				uni.setStorage({
					key:'temployeeInfoTitleCache',
					data:title
				})
				uni.setStorage({
					key:'temployeeInfoDataCache',
					data:data
				})
			},
			toShowTable(mark,title){
				this.cancel()
				 if(mark == 'temployee-info'){
					 let arr = this._.cloneDeep(this.formTitle)
					 arr.shift()
					 this.setCache(arr,this.userData)
					 uni.navigateTo({
					 	url:'./temployee-info'
					 })
				 }else{
					 uni.navigateTo({
					 	url:'./temployee-showTable?mark='+mark+'&userId='+this.selectUserId+'&title='+title+'&userName='+this.userData['username'],
					 })
				 }
			},
			openPopup(){
				this.$refs.popup.open()
			},
			cancel(){
				this.$refs.popup.close()
			},
			getUserInfo(id){
				let _that = this
				uni.showLoading({
					mask: true,
					title: '请稍候...'
				})
				_that.om.request(
					"temployee/getDataGrid",
					{
						id: id,
						page: 1,
						rows: 20,
					},
					'get',true
				).then(res=>{
					_that.userData = res.rows[0]
					let arr = [] 
					for(let item of _that.formTitle){
						if(_that.userData[item.field]){
							if(arr.length<10){
								arr.push(item)
							}
						}
					}
					_that.showTitle = arr
					_that.setCache(_that.formTitle,_that.userData)
					uni.hideLoading()
				})
			},
			loadMore(){
				let _that = this
				_that.param.page += 1
				if(_that.filterList[2].detailList && (_that.filterList[2].detailList.length%_that.param.rows)== 0){
					_that.om.request(
						'temployee/getDataGrid',
						_that.param,
						'get',true
					).then(res=>{
						if(res.total != _that.filterList[2].detailList.length){
							let arr = _that.getNewArr('id','username',res.rows)
							_that.filterList[2].detailList.push(...arr)
						}else{
							_that.param.page -= 1
						}
					})
				}else{
					_that.param.page -= 1
				}
			},
			hasThis(arr,value){
				let _that = this
				for(let index in arr){
					if(value == arr[index].value){
						return index
					}
				}
				return ''
			},
			onChangeFilter(e,obj,isDestroy){
				let _that = this
				if(obj.key == 'instIds'){
					_that.param.page = 1
					for(let index in _that.filterList){
						if(_that.filterList[index].key == obj.key){
							_that.salaryPostCheckedItem(_that.filterList[index].detailList,_that.filterList[index],e.instIds)
						}
					}
					_that.param.instIds = e.instIds
					uni.showLoading({
						mask: true,
						title: '请稍候...'
					})
					_that.om.request(
						'temployee/getDataGrid',
						_that.param,
						'get',true
					).then(res=>{
						if(res.rows){
							if(res.rows.length >= 1){
								_that.filterList[2].detailList = _that.getNewArr('id','username',res.rows)
								_that.filterList[2].defaultSelectedIndex = 0
								_that.selectUserId = _that.filterList[2].detailList[0].value
								_that.selectUserName = _that.filterList[2].detailList[0].title
								_that.getUserInfo(_that.filterList[2].detailList[0].value)
							}else{
							_that.tips = '当前登录人无权限查看'
							_that.filterList[2].defaultSelectedIndex = 0
							_that.filterList[2].detailList = [
								{	
									'title': '姓名',
									'value': ''
								}]
							_that.showTitle = []
							}
						}
						uni.hideLoading()
					})
				}else if(obj.key == 'name'){
					_that.selectUserId = e.name
					_that.getUserInfo(e.name)
				}
			},
			getNewArr(value,title,dataList,detailList,id){
				let _that = this
				let newArr = [] 
				for(let index in dataList){
					let obj = {
						title:'',
						value:''
					}
					obj.title = dataList[index][title]
					obj.value = dataList[index][value]
					if(detailList && (dataList[index].id == (id?id:_that.userId))){
						detailList.defaultSelectedIndex = Number(index)
					}
					newArr.push(obj)
				}
				return newArr
			},
			changeArr(otit, ntit, oval, nval, data){
				for(let i=0; i<data.length; i++){
					if(otit){
						data[i][ntit] = data[i][otit]
					}
					if(oval){
						data[i][nval] = data[i][oval]
					}
				}
				return data;
			},
			salaryPostCheckedItem(list,filterList,id){
				let _that = this
				for(let item of list){
					if(item.id == (id || _that.salaryInstId)){
						item.checked = true
						if(filterList){
							filterList.defaultSelectedText = item.id
							filterList.defaultSelectedValue = item.text
							filterList.title = item.text
						}
					}else{
						item.checked = false
					}
					if(item.children && item.children.length){
						_that.salaryPostCheckedItem(item.children,filterList,id)
					}
				}
				return
			},
			initLoad(options){
					let _that = this
					if(options.instId){
						_that.param.instIds = options.instId
					}else{
						_that.param.instIds = _that.salaryInstId
					}
					uni.showLoading({
						mask: true,
						title: '请稍候...'
					})
					let arr = [ 
						_that.om.request("torganization/getOrgList",{},'get',true),
						_that.om.request("tinstitution/getComboTree",{},'get',true),
						_that.om.request(
							'temployee/getDataGrid',
							_that.param,
							'get',true
						),
						_that.om.request(
							'ttableColumn/getGridModel',
							{
								tableMark:'KEY_31'
							},
							'get',true
							),
						_that.om.request(
							"temployee/getDataGrid",
							{
								userName:options.userName?options.userName:_that.userName,
								page: 1,
								rows: 20,
							}
						)	
					 ]
					 Promise.all(arr).then(res=>{
						_that.filterList[0].detailList = _that._.cloneDeep(_that.changeArr('shortName', 'title', 'id', 'value', res[0]))
						let list = _that._.cloneDeep(res[1])
						_that.salaryPostCheckedItem(list,_that.filterList[1],options.instId)
						_that.filterList[1].detailList = list
						if(_that.$refs.slFilter){
							_that.$refs.slFilter.resetMenuList(_that.filterList)
						}
						_that.userData = res[4].rows[0]
						_that.selectUserId = _that.userId
						let arr = _that.getNewArr('id','username',res[2].rows,_that.filterList[2],options.userId)
						if(arr.length){
							_that.filterList[2].detailList = arr
						}
						res[3].value.frozenColumns[0].push(...res[3].value.columns[0])
						_that.formTitle = res[3].value.frozenColumns[0]
						_that.setCache(_that.formTitle,_that.userData)
						for(let item of res[3].value.frozenColumns[0]){
							if(_that.userData){
								if(_that.userData[item.field]){
									if(_that.showTitle.length<10){
										_that.showTitle.push(item)
									}
								}
							}else{
								_that.om.toast('无权限查看')
							}
						}
						 uni.hideLoading()
					 })
				}
			},
		onLoad(options){
			let _that = this
			_that.pageTitle = options.title || '人员信息查询';
			uni.setNavigationBarTitle({
				title: _that.pageTitle
			});
			_that.filterList[0].detailList = [{
												'title': _that.orgShortName,
												'value': _that.orgid
											}]
			_that.filterList[1].defaultSelectedText = options.instId?options.instId:_that.salaryInstId
			_that.filterList[1].defaultSelectedValue = options.instName?options.instName:_that.salaryInstName
			_that.filterList[1].title = options.instName?options.instName:_that.salaryInstName
			_that.initLoad(options)
		}
	}
</script>

<style scoped>
	.footerSize{
		font-size: 14px;
	}
	.popup-item{
		height:50px;
		background-color: #FFFF;
		font-size: 16px;
		text-align: center;
		border-bottom: 1px solid #EEEEEE;
		display: flex;
		justify-content: space-between;
	}
	.popup-cotent{
		width: 300px;
		background-color: white;
		border-radius: 10px;
	}
	.popup-tip{
		font-size: 16px;
		color:#b0b0b0 ;
	}
	.cancel-btn{
		text-align: center;
		display: block;
		color: #0081ff;
		background-color: #cce6ff;
		height: 36px;
		line-height: 36px;
		width: 72px;
		margin: 15px auto 0;
	}
</style>                                                  
